$(function(){
    //go字符串渲染页面
    $.ajax({
        url : "../static/data/gos.json",
        success: function(res){
            renderGos(res.gos);
        }
    })
    function renderGos (res){
        $(".top_row").html(
            res.map(item =>
                `<div class="imgBox">
                    <a href="http://localhost:8080/product.html" target="_blank"><img src="${item.image}" alt=""></a>
                    <div class="mask1"></div>
                    <div class="mask2"></div>
                </div> `
            ).join("")
        )
    }
    //猜你喜欢 字符串渲染页面
    $.ajax({
        url : "../static/data/likes.json",
        success: function(res){
            renderLikes(res.likes);
        }
    })
    function renderLikes(res){
        $(".guessLikeContent").html(
            res.map(item =>
              `<div class="likeBox">
              <a href="http://localhost:8080/product.html" target="_blank"><img src="${item.image}" alt=""></a>
                  <h3>${item.title}</h3>
                  <p>￥${item.price}</p>
              </div>`
            ).join("")
        )
    }
    //1F center 字符串渲染
    $.ajax({
        url : "../static/data/floorCenter.json",
        success: function(res){
            renderFloors(res.floors);
        }
    })
    function renderFloors(res){
        $(".secondBlock").html(
            res.map(item =>
              `<div class="center">
                  <h1>${item.detial}</h1>
                  <h2>${item.title}</h2>
                  <p>￥${item.price}</p>
                  <a href="http://localhost:8080/product.html" target="_blank"><img src="${item.image}" alt=""></a>  
              </div>`
            ).join("")
        )
    }
    //Right 字符串渲染页面
    $.ajax({
        url : "../static/data/floorRight.json",
        success: function(res){
            renderFloor(res.floor);
        }
    })
    function renderFloor(res){
        $(".threeBlock").html(
            res.map(item =>
              `<div class="right">
                  <h1>${item.detial}</h1>
                  <h2>${item.title}</h2>
                  <p>￥${item.price}</p>
                  <a href="http://localhost:8080/product.html" target="_blank"><img src="${item.image}" alt=""></a>  
              </div>`
            ).join("")
        )
    }
})